<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>创建日期对象(create date object)</title>
  <!-- 
  在JavaScript中， `Date` 对象用于处理日期和时间。它提供了多种方法来获取和操作日期及时间。以下是关于如何创建 `Date` 对象的总结说明：

  一、创建 `Date` 对象的方法
  1. 无参数构造函数：
    - 使用 `new Date()` 可以创建一个表示当前日期和时间的 `Date` 对象。
    const now = new Date();
    console.log(now); // 输出当前日期和时间

  2. 传递时间戳：
    - 可以通过传递一个时间戳（自1970年1月1日00:00:00 UTC以来的毫秒数）来创建 `Date` 对象。
    const dateFromTimestamp = new Date(1633072800000); // 2021-10-01T00:00:00.000Z
    console.log(dateFromTimestamp);

  3. 传递日期字符串：
    - 可以通过传递一个符合ISO 8601格式的日期字符串来创建 `Date` 对象。
    const dateFromString = new Date("2021-10-01T00:00:00Z");
    console.log(dateFromString); // 输出: 2021-10-01T00:00:00.000Z

  4. 传递年、月、日等参数：
    - 可以通过传递多个参数（年、月、日、小时、分钟、秒、毫秒）来创建 `Date` 对象。注意，月份是从0开始计数的（0代表1月，1代表2月，以此类推）。
    const specificDate = new Date(2021, 9, 1, 12, 0, 0); // 2021年10月1日12:00:00
    console.log(specificDate);

  二、 `Date` 对象的方法
  `Date` 对象提供了许多方法来获取和设置日期和时间的各个部分。

  1. 获取日期和时间：
    -  `getFullYear()` ：获取四位数的年份。
    -  `getMonth()` ：获取月份（0-11）。
    -  `getDate()` ：获取一个月中的某一天（1-31）。
    -  `getHours()` ：获取小时（0-23）。
    -  `getMinutes()` ：获取分钟（0-59）。
    -  `getSeconds()` ：获取秒（0-59）。
    -  `getMilliseconds()` ：获取毫秒（0-999）。
    -  `getTime()` ：获取自1970年1月1日以来的毫秒数。

    const date = new Date();
    console.log(date.getFullYear()); // 输出当前年份
    console.log(date.getMonth()); // 输出当前月份（0-11）
    console.log(date.getDate()); // 输出当前日期（1-31）
  2. 设置日期和时间：
    -  `setFullYear(year)` ：设置年份。
    -  `setMonth(month)` ：设置月份（0-11）。
    -  `setDate(date)` ：设置日期（1-31）。
    -  `setHours(hours)` ：设置小时（0-23）。
    -  `setMinutes(minutes)` ：设置分钟（0-59）。
    -  `setSeconds(seconds)` ：设置秒（0-59）。
    -  `setMilliseconds(milliseconds)` ：设置毫秒（0-999）。

    const date = new Date();
    date.setFullYear(2022);
    date.setMonth(11); // 设置为12月
    console.log(date); // 输出设置后的日期
    
  三、总结
  -  `Date` 对象用于处理和操作日期和时间，可以通过多种方式创建。
  - 通过无参数构造函数创建当前时间，通过时间戳、日期字符串或年、月、日等参数创建特定日期。
  -  `Date` 对象提供了丰富的方法来获取和设置日期和时间的各个部分。

  理解 `Date` 对象的创建和使用方法可以帮助开发者在JavaScript中有效地处理日期和时间。
   -->
</head>
<body>

  <script>
    // 1. 创建 Date 对象
    const date = new Date();
    console.log("创建 Date 对象", date); // Sat Sep 07 2024 15:56:12 GMT+0800 (中国标准时间)

    // 2. 获取日期和时间
    console.log("获取年份", date.getFullYear()); // 输出当前年份
    console.log("获取月份", date.getMonth()); // 输出当前月份（0-11）
    console.log("获取日期", date.getDate()); // 输出当前日期（1-31）
    console.log("获取小时", date.getHours()); // 输出当前小时（0-23）
    console.log("获取分钟", date.getMinutes()); // 输出当前分钟（0-59）
    console.log("获取秒数", date.getSeconds()); // 输出当前秒数（0-59）
    console.log("获取毫秒数", date.getMilliseconds()); // 输出当前毫秒数（0-999）
    console.log("获取时间戳", date.getTime()); // 输出自1970年1月1日以来的毫秒数

    // 3. 设置日期和时间
    date.setFullYear(2022);
    date.setMonth(11); // 设置为12月

    // 4. 格式化日期和时间
    const formattedDate = date.toLocaleDateString();
    const formattedTime = date.toLocaleTimeString(); 
    console.log("格式化日期", formattedDate); // 输出格式化后的日期 2022/12/7
    console.log("格式化时间", formattedTime); // 输出格式化后的时间 15:57:17
    console.log("格式化后的日期和时间", date.toLocaleString()); //  2022/12/7 15:57:17
    console.log("ISO格式的日期和时间", date.toISOString()); //  2022-12-07T07:57:17.000Z
    
    // 5. 日期和时间的计算
    const date1 = new Date(2022, 0, 1); // 2022年1月1日
    const date2 = new Date(2022, 11, 31); // 2022年12月31日
    const diff = date2.getTime() - date1.getTime(); // 时间差（毫秒）
    const days = diff / (1000 * 60 * 60 * 24); // 时间差（天数）
    console.log("时间差（毫秒）", diff); // 输出时间差（毫秒） 31536000000
    console.log("时间差（天数）", days); // 输出时间差（天数） 365

    // 6. 传入参数
    // 6.1 时间字符串
    const date3 = new Date("2022-01-01");
    console.log("时间字符串", date3); // 输出 2022-01-01T00:00:00.000Z

    // 6.2 Unix时间戳
    const date4 = new Date(1640995200000);
    console.log("时间戳", date4); // 输出 2022-01-01T00:00:00.000Z

    // 6.3 年、月、日、时、分、秒、毫秒
    const date5 = new Date(2022, 0, 1, 12, 0, 0, 0);
    console.log("年、月、日、时、分、秒、毫秒", date5); // 输出 2022-01-01T12:00:00.000Z

  </script>
  
</body>
</html>